/* Global HTML5 Boilerplate Reset */
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, figcaption, figure,footer, header, hgroup, menu, nav, section, summary,time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	font-size: 14px;
}
textarea
{
    resize:none;
}
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {
    display: block;
}
nav ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
ins { background-color:#ff9; color:#000; text-decoration:none; }
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
table { border-collapse:collapse; border-spacing:0; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
input, select { vertical-align:middle; }

/* Application */
html, body
{
	background-color: black;
	font-family: Arial, Verdana, sans-serif;
	font-size: 12px;
	cursor: default;
	
	/*background-image: url(../images/texture-ipad.gif);*/
	
	-webkit-text-size-adjust: none;
	
	color: white;
	
	min-height: 416px;
}

/* Les liens */
a
{
	color: #ABABAB;
	text-decoration: none;
}
a:hover
{
	color: white;
}

/* Les listes */
ul li
{
	margin-left: 0px;
	text-indent: 0;
}
ul li ul
{
	margin-bottom: 15px;
}
ul li ul li
{
	list-style-type: square;
}

/* Le spacer */
.spacer
{
	width: 50px;
}

/* Le clear */
.clear
{
	clear: both;
}

.slideTransition.revealOut
{
	-webkit-animation-name: slideLeft;
}
.slideTransition.revealIn
{
	-webkit-animation-name: slideRight;
}

.slideTransition.revealOut.back
{
	-webkit-animation-name: slideRight;
}
.slideTransition.revealIn.back
{
	-webkit-animation-name: slideLeft;
}


.slidesContainer
{
	position: relative;
	
	width: 100%;
	overflow: hidden;
	
	min-height: 50px;
	
	-webkit-transition-property: height;
	-webkit-transition-duration: .5s;
	-webkit-transition-easing: ease-in-out;
	
	transition-property: height;
	transition-duration: .5s;
	transition-easing: ease-in-out;
}
.mediaLoading
{
	color: white;
	text-align: center;
	padding-top: 15px;
}
.translateAnimation
{
	position: absolute;
	top: 0px;
	left: 0px;
	
	width: 100%;
}
.iDevice .translateAnimation
{
	-webkit-transition-property: left, translate3D, opacity;
	-webkit-transition-duration: .5s;
	-webkit-transition-easing: ease-in-out;
	
	transition-property: left, translate3D, opacity;
	transition-duration: .5s;
	transition-easing: ease-in-out;
}
.androPhone .translateAnimation
{
	-webkit-transition-property: left, translate3D, opacity;
	-webkit-transition-duration: 0.01s;
	
	transition-property: left, translate3D, opacity;
	transition-duration: 0.01s;
}

.iDevice .toLeft
{
	-webkit-transform: translate3D(-100%, 0, 0);
	transform: translate3D(-100%, 0, 0);
	
	opacity: 0;
}
.iDevice .toCenter
{
	-webkit-transform: translate3D(0, 0, 0);
	transform: translate3D(0, 0, 0);
	
	opacity: 1;
}
.iDevice .toRight
{
	-webkit-transform: translate3D(100%, 0, 0);
	transform: translate3D(100%, 0, 0);
	
	opacity: 0;
}


.androPhone .toLeft
{
	left: -100%;
}
.androPhone .toCenter
{
	left: 0%;
}
.androPhone .toRight
{
	left: 100%;
}

/* Les liens */
a
{
	color: #ABABAB;
	text-decoration: none;
}
a:hover
{
	color: white;
}

/* Les listes */
ul li
{
	margin-left: 0px;
	text-indent: 0;
}
ul li ul
{
	margin-bottom: 15px;
}
ul li ul li
{
	list-style-type: square;
}

/* Le spacer */
.spacer
{
	width: 50px;
}

/* Le clear */
.clear
{
	clear: both;
}

.left
{
	float: left;
}
.right
{
	float: right;
}

/* Les erreurs 404 */
.error404
{
	color: white;
	text-align: center;
	padding-top: 10px;
}

/* On masque tous les contenus */
#home,
#pageForTransition,
#page
{
	display: none;
}

/* Le loading */
#loading
{
	position: absolute;
	top: 50%;
	left: 50%;
	width: 50px;
	height: 50px;
	
	margin-left: -25px;
	
	z-index: 1000;
	
	-webkit-border-radius: 5px;
	border-radius: 5px;
	
	background: rgba(0, 0, 0, 0.5);
}

#loading img
{
	position: absolute;
	top: 50%;
	left: 50%;
	width: 32px;
	height: 32px;
	
	margin-top: -16px;
	margin-left: -16px;
}

/* Le logo */
.logo
{
	background-image: url(../images/logo.png);
	background-repeat: no-repeat;
	
	display: block;
	
	margin: 0px auto;
	
	border-radius: 10px;
	
	/*box-shadow: 0px 0px 10px rgba(0, 0, 0, .7);
	-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .7);*/
	
	zoom: 0.58;
	
	width: 240px;
	height: 55px;
}
.logo.big
{
	zoom: 1;
	
	margin: 15px auto;
}

/* Fat bouton menu */
.iButton
{
	position: relative;
	
	display: block;
	clear: both;
	
	background: url(../images/button_bg.jpg) repeat-x center top #000000;
	border: 1px solid #383838;
	color: #CCCCCC;
	border-top-color: #565656;
	background-color: #000000;
	font-family: 'Yanone Kaffeesatz', serif;
	color: white;
	font-size: 22px;
	font-weight: normal;
	
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	
	box-shadow: 0px 0px 10px rgba(0, 0, 0, .7);
	-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .7);
	
	padding: 10px 0 10px 10px;
	
	margin: 10px 15px 10px 15px;
	
	height: 30px;
	
	text-transform: uppercase;
	overflow:hidden;
}
.iButton.arrow:after
{
	display: block;
	content: "";
	
	width: 13px;
	height: 11px;
	
	position: absolute;
	top: 19px;
	right: 5px;
	
	background-image: url(../images/arrow-right.gif);
	background-repeat: no-repeat;
	background-position: 0 -1px;
}

/* Bouton classique orange */
.classicButton
{
	position: relative;
	
	display: block;
	
	background: url(../images/button_bg.jpg) repeat-x center top #000000;
	border: 1px solid #383838;
	color: #CCCCCC;
	border-top-color: #565656;
	
	font-family: 'Yanone Kaffeesatz', serif;
	text-align: center;
	color: white;
	font-size: 16px;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	
	text-transform: uppercase;
	
	padding-top: 2px;
	height: 23px;
	
	-moz-box-shadow: 0 0 1px black;
	-webkit-box-shadow: 0 0 1px black;
	box-shadow: 0 0 1px black; /* CSS3 text shadow */
	text-shadow: 0 1px black;
}
.classicButton:after
{
	display: block;
	content: "";
	
	position: absolute;
	
	background-repeat: no-repeat;
}
.classicButton.back:after
{
	left: 5px;
	top: 6px;
	
	width: 7px;
	height: 13px;
	
	background-image: url(../images/arrows.gif);
	background-position: -13px 0;
}
.classicButton.up:after
{
	left: 5px;
	top: 8px;
	
	width: 13px;
	height: 7px;
	
	background-image: url(../images/arrows.gif);
	background-position: -13px 0;
}
.classicButton
{
	float: none !important;
	position: absolute;
	width: 70px;
	top: 15px;
}
.homeButton
{
    position:absolute;
    display: inline-block;
    right:8px;
    font-weight:bold;
    top: 15px;
}
.homeButton *
{
    display: inline-block;
    vertical-align:bottom;
}
.classicButton.left
{
	left: 8px;
}
.classicButton.right
{
	right: 8px;
}

/* Pointillets */
.dashed
{
	border-bottom: #666666 dashed 1px;
	width: 100%;
	display: block;
	clear: both;
	margin: 3px 0;
}

/* Pied de page */
.footer
{
	position: relative;
	
	/*background-image: url(../images/back-mobile.png);*/
	background-repeat: repeat-x;
	background-position: 0 -60px;
	
	padding-top: 15px; 
	height: 145px;
	
	text-align: center;
	font-size: 12px;
	color: #e5e5e5;
	text-shadow: #000000;
	border-top:solid 1px gray;
}
.footer.small
{
	height: 60px;
}
.footer a
{
	color: #e5e5e5 !important;
}
.social
{
	display: inline-block;
	
	border-radius: 10px;
	
	box-shadow: 0px 0px 10px rgba(0, 0, 0, .7);
	-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .7);
	
	width: 60px;
	height: 60px;
	
	margin: 14px 6px 14px 8px;
}
.social.facebook
{
	background-image: url(../images/mobile-social.png);
	background-repeat: repeat-x;
	background-position: 0 0;
}
.social.linkedin
{
	background-image: url(../images/mobile-social.png);
	background-repeat: repeat-x;
	background-position: -60px 0;
}
.social.twitter
{
	background-image: url(../images/mobile-social.png);
	background-repeat: repeat-x;
	background-position: -120px 0;
}
.social.rss
{
	background-image: url(../images/mobile-social.png);
	background-repeat: repeat-x;
	background-position: -180px 0;
}

/* Language */
.lang
{
	margin: 0 10px;
}
.lang span
{
	background: transparent url(../images/flags.gif) no-repeat;
	width: 20px;
	height: 13px;
	margin: 0 5px;
}
.lang.fr span
{
	background-position: 0px -13px;
	float: left;
}
.lang.en span
{
	background-position: -20px -13px;
	float: right;
}

.header
{
	position: relative;
	
	height: 60px;
	
	background-image: url(../images/bg_header.gif);
	background-repeat: repeat-x;
	background-position: 0 0;
	
	border-bottom:solid 1px gray;
	
	box-shadow: 0px 0px 20px rgba(0, 0, 0, .7);
	-webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, .7);
}
.header .logo
{
	margin: 0 auto;
	top: 6px;
}
.header > .dashed
{
	position: absolute;
	
	bottom: -1px;
}

/* Showreel */
#showreel
{
	width: 100%;
	height: 270px;
}

#showreel .youtube-player,
#showreel iframe
{
	width: 100%;
	height: 270px;
}

/* Categories title, job title et news title */
.categoryTitle, .jobTitle, .newsTitle, .searchTitle
{
	position: relative;
	font-family: 'Yanone Kaffeesatz', serif;
}
.categoryTitle, .searchTitle
{
	height: 54px;
}
.jobTitle
{
	min-height: 50px;
	height: auto;
}
.newsTitle
{
	height: auto;
}

.categoryTitle h1, .jobTitle h1, .newsTitle .inner
{
	font-weight: normal;
	display: block;
	color: white;
	font-size: 30px;
	text-transform: uppercase;
}
.categoryTitle h1
{
	float: left;
	
	position: absolute;
	left: 15px;
	bottom: 8px;
}
.jobTitle h1
{
	position: relative;
	line-height: 35px;
	text-align: center;
	width: 80%;
	margin: 12px auto -5px auto;
}
.newsTitle .inner
{
	position: relative;
	text-align: left;
	margin: 6px 110px 0 18px;
}
.newsTitle
{
	padding-bottom: 9px;
}

.categoryTitle .dates, .newsTitle .date
{
	display: block;
	float: right;
	color: #c8c8c8;
	font-size: 24px;
	font-weight: normal;
	
	position: absolute;
	right: 15px;
	bottom: 10px;
	
	font-style: italic;
}

.miniArrow
{
	position: absolute;
	top: 10px; 
	
	width: 7px;
	height: 13px;
	
	background-image: url(../images/arrows.gif);
	background-repeat: no-repeat;
}
.previous
{
	float: none !important;
	left: 10px;
	background-position: -13px 0;
}
.next
{
	float: none !important;
	right: 10px;
	background-position: -19px 0;
}

.slide
{
	position: relative;
	
	overflow: hidden;
	
	background-color: #333;
 	margin: 15px auto;
}
.slide a
{
	text-decoration: none;
}

.slide a .title h3
{
	font-family: 'Yanone Kaffeesatz', serif;
	font-size: 18px;
	color: white !important;
	font-weight: normal;
	text-transform: uppercase;
	
	position: absolute;
	
	top: 0;
	left: 0;
	right: 0;
	height: auto;
	
	padding: 2px 5px 2px 5px;
	
	background-color: rgba(0, 0, 0, 0.4);
}

.media
{
	width: 290px;
	margin: 10px auto;
}

/* Les contenus et titres */
.credits .text
{
	width: 230px;
	margin: 10px auto;
}
.credits p
{
	color: #cdcdcd;
	margin-bottom: 10px;
}
.credits h3
{
	color: #ff7f00;
	font-weight: normal;
}
.credits ul
{
	margin-bottom: 10px;
}
.credits li
{
	list-style: none;
	color: white;
}

.credits .link
{
	text-align: right;
}

/* Contact */
.contact-bloc
{
	margin: 20px 15px;
	color: white;
}
.gmap-coords
{
	display: none;
}
.ajax-contact-address
{
	color: #CCC;
}
.ajax-contact-emails ul li a
{
	text-decoration: underline;
	color: #CCC;
}
.ajax-contact-block strong
{
	color: #DEDEDE;
}
.ajax-contact-emails ul li
{
	list-style-image: url('../images/contact_picto.jpg');
	margin-left: 24px;
	margin-top: 2px;
	color: #CCC;
}

.ajax-content h1.cufonYanone, .content h1.cufonYanone
{
	font-family: 'Yanone Kaffeesatz', serif;
	color: white;
	font-size: 30px;
	font-weight: normal;
	text-align: center;
	font-style: italic;
	text-transform:uppercase;
}
.ajax-content .CMSPage h1.cufonYanone,
.ajax-contact-header h1.cufonYanone,
.ajax-news h1.cufonYanone
{
	margin: 9px auto 12px auto;
}
.ajax-content .CMSPage p
{
	clear: both;
	margin-bottom: 10px;
}
.ajax-content .CMSPage h2
{
	color: #ff7f00;
	margin: 1px 0 4px 0;
}
.ajax-content .CMSPage a
{
	color: #ff7f00;
	text-decoration: none;
}

.ajax-content
{
	color: #cccccc;
}

/* Les news */
.ajax-news-block-image
{
	margin: 0px 18px 9px 18px;
}
.ajax-news-block-description
{
	font-size: 13px !important;
	margin: 0px 18px 18px 18px;
}
.ajax-news-block
{
	padding-bottom: 8px;
}

/* Le CMS */
.CMSContent *
{
	color: white;
	font-size: 14px;
}
.CMSContent a {
	color: #FF7F00 !important;
	text-decoration: none !important;
}
.CMSContent a:hover {
	color: #FF7F00 !important;
}

/* Ajouter un offset sur les pages Ajax dans le layout mobile */
.mobileOffset
{
	padding: 7px 10px;
}

/* La recherche */
.searchFormContainer
{
	position: relative;
	
	width: 100%;
	height: 40px;
}
.searchField
{
	border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    top: 6px;
    right: 6px;
    bottom: 6px;
    left: 6px;
    background:#FFF;
    background-image: linear-gradient(top, #DDDDDD, #FFFFFF);
    background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#DDDDDD),color-stop(1,#FFFFFF));
    -msfilter:"progid:DXImageTransform.Microsoft.gradient(startColorStr='#DDDDDD',EndColorStr='#FFFFFF')";
}

.searchField input
{
	background-color: transparent;
	border: none;
	
	width: 280px;
	margin-left: 3px;
	
	color: #131313;
	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	
	width: 90%;
	margin-top: 3px;
}
.searchField input:focus
{
	outline: none;
}
.searchField a
{
	display: block;
	
	position: absolute;
	top: 13px;
	right: 7px;
	
	width: 11px;
	height: 11px;
	
	background-image: url("../images/search.png");
	background-position: -11px 0px;
}
.searchTitle
{
	border-top: #666666 dashed 1px;
	border-bottom: #666666 dashed 1px;
	width: 100%;
	display: block;
	clear: both;
	margin: 3px 0;
	padding-top: 5px;
	
	height: 28px;
	
	font-size: 18px;
	text-align: center;
}
.searchTitle.first
{
	border-top: none;
}
.noresults
{
	display: block;
	margin-top: 15px;
	margin-bottom: 15px;
	text-align: center;
}



/*
 * Les accélérations graphiques pour la planche à saucisson tactile et les pommes
 */
.iDevice #loading,
.iDevice .footer,
.iDevice .iButton,
.iDevice .slidesContainer,
.iDevice .mediaLoading,
.iDevice .media
{
	-webkit-transform: translate3D(0px, 0px, 0px) !important;
}